<script setup lang="ts">
import type{ Ref } from 'vue';
import { ref } from 'vue';
import { computed } from 'vue';
import { registerListFn } from '@/api/register';
import { useRouter } from 'vue-router';
import { Value } from 'sass';
const router =useRouter()
const flag = computed(() => {
    return /^(?:(?:\+|00)86)?1[3-9]\d{9}$/.test(tel.value) != true||/^\d{6}((((((19|20)\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|(((19|20)\d{2})(0[13578]|1[02])31)|((19|20)\d{2})02(0[1-9]|1\d|2[0-8])|((((19|20)([13579][26]|[2468][048]|0[48]))|(2000))0229))\d{3})|((((\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|((\d{2})(0[13578]|1[02])31)|((\d{2})02(0[1-9]|1\d|2[0-8]))|(([13579][26]|[2468][048]|0[048])0229))\d{2}))(\d|X|x)$/.test(passwordcard.value) !=true|| (male.value=='男'||'女') !=true||Number(password.value) <=6

})
const work=ref('')
const name=ref('')
const password=ref('')
const tel=ref('')
const male=ref('')
const passwordcard=ref('')
const location=ref('')
const checked=ref(true)
function registerClick(){
   
    registerListFn({name:name.value,password:password.value,
        tel:tel.value,male:male.value,passwordcard:passwordcard.value,
        location:location.value,work:work.value
    }).then(res=>{
        let msg =localStorage.getItem('login')||''
        if(msg!=''){

            let  message=JSON.parse(msg)
            message.push(res.data)
        message=JSON.stringify(message)
        localStorage.setItem('login',String(message))
        router.push('/login')
        }else{
        let  message=msg
        message= res.data
        message=JSON.stringify(message)
        localStorage.setItem('login',String(message))
        router.push('/login')
        }
      
    })
}
</script>
<template>
    <main class="box">
      <header class="header">
          <slot name="left"></slot>
          <span>注册</span>
          <slot name="right"></slot>
      </header>
    <div class="content"> 
        <van-cell-group class="registermessage" inset>
        <van-field v-model="name" label="姓名" placeholder="请输入姓名" />
        <van-field v-model="password" label="密码" placeholder="请输入密码" />
        <van-field v-model="tel" label="手机号" placeholder="请输入手机号" />
        <van-field v-model="male" label="性别" placeholder="请输入性别" />
        <van-field v-model="passwordcard" label="身份证" placeholder="请输入身份证，成为房东时有用" />
        <van-field v-model="location" label="地址" placeholder="请输入地址" />
        <van-field v-model="work" label="职业" placeholder="请输入职业" />
        </van-cell-group>
        <button class="login" :disabled="flag" @click="registerClick">提交</button>
    </div>
    </main>
</template>

<style lang="scss" scoped>
body,html,.box{
    background-color: #f4f6f9;
    margin: 0;
    padding: 0;
}
.registermessage{
    width: 100%;
    position: relative;
    right: 20px;
}
.login{
    position: absolute;
    width: 90%;
    background-color: #4a73ff;
    height: 56px;
    left: 5%;
    top: 3.6rem;
    border-radius: 10px;
    color: white;
    font-size: 20px;
}
    </style>
    